<template>
  <div class="picture">
    <div class="picture-head">
      <Head></Head>
    </div>
    <article>
      <figure class="picture-box" v-for="item in piclist" :key="item.id">
        <img class="Img" :src="item.img" />
        <figcaption class="date">{{ item.date }}</figcaption>
        <figcaption class="text">{{ item.text }}</figcaption>
      </figure>
    </article>
    <div>
      <el-backtop
        target=".picture"
        :bottom="100"
        :visibility-height="100"
        :right="50"
      >
        <div class="backtop"></div>
      </el-backtop>
    </div>
  </div>
</template>
 <script>
//  import eventBus from './eventBus'
import Head from "../components/head";
export default {
  data() {
    return {
      piclist: [],
    };
  },
  mounted() {
    // eventBus.$emit
    // eventBus.$on
    this.$http.post("/api/user/select_theLife", {}).then((response) => {
      //初始化加载数据
      console.log("瀑布流数据", response.data);
      this.piclist = response.data;
    });
  },
  methods: {},
  components: {
    Head,
  },
};
</script>

 <style scoped>
@import "../css/picture.css";
</style>